<!--_meta 作为公共模版分离出去-->
<include file='public/_meta'>
<!--/meta 作为公共模版分离出去-->
<link href="__PUBLIC__/lib/lightbox2/2.8.1/css/lightbox.css" rel="stylesheet" type="text/css" >


<title>基本设置</title>
</head>
<body>
<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页
    <span class="c-gray en">&gt;</span>
    车辆管理
    <span class="c-gray en">&gt;</span>
    添加车辆
    <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a>
</nav>
<div class="page-container">
    <form class="form form-horizontal" id="form-article-add" method="post" action="{:url('index/cars/add')}" enctype="multipart/form-data">
    
            <div id="tab-system" class="HuiTab">
            <div class="tabBar cl">
                <span>通用信息</span>
                <span>智能设备</span>
                <span>电子文件</span>
                <span>汽车模型</span>
                
            </div>
            <div class="tabCon">
                <div class="row">
                    
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                       
                        车牌号码：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" id="website-title" name="car_sn" placeholder="请填写车牌号码" value="" class="input-text">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                        <span class="c-red">*</span>
                        车辆识别代码/车架号：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" id="website-Keywords" name="car_unique_id" placeholder="" value="" class="input-text">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                        <span class="c-red">*</span>
                        发动机号：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" id="website-Keywords" name="motor_id" placeholder="" value="" class="input-text">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                        <span class="c-red">*</span>
                        车辆型号：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" id="website-Keywords" name="car_name" placeholder="" value="" class="input-text">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                        <span class="c-red">*</span>
                        汽车品牌：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <span class="select-box" style="width:300px;">
                            <select class="select" name="brand_id" size="1">
                                <foreach name='brand' item='value' key='key'>
                                    <option value="{$value.id}">{$value.name}</option>
                                </foreach>
                            </select>
                        </span>
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                        <span class="c-red">*</span>
                        车辆类型：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <span class="select-box" style="width:300px;">
                            <select class="select" name="car_breed" size="1">
                               <option value="0">小型轿车</option>
                               <option value="1">SUV</option>
                               <option value="2">中巴</option>
                            </select>
                        </span>
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                        <span class="c-red">*</span>
                        机动车所有人：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <span class="select-box" style="width:150px;">
                            <select class="select" name="holder_type" size="1" onchange="get_car_type(this)">
                                    <option value="">请选择</option>
                                    <option value="0">所属公司</option>
                                    <option value="1">个人车主</option>
                                
                            </select>
                        </span> 
                        <span class="select-box" style="width:150px;">
                            <select class="select" name="holder_id" size="1" id="">
                                <option value="">请选择</option>
                                <foreach name='holder' item='value' key='key'>
                                    <option value="{$key}">{$value}</option>
                                </foreach>
                                            
                            </select>
                        </span> 
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                       
                        租赁类型：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <span class="select-box" style="width:300px;">
                            <select class="select" name="relevance" size="1">
                               <option value="">请选择</option>
                               <option value="1">分时租赁</option>
                               <option value="2">企业用车</option>
                               <option value="3">共享用车</option>
                               <option value="4">长租车辆</option>
                               <option value="5">自测试用</option>
                               <option value="6">上牌整备</option>
                               <option value="7">整备待租</option>
                            </select>
                        </span>
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                        
                        加盟商：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <span class="select-box" style="width:300px;">
                            <select class="select" name="agency_id" size="1">
                                    <option value="">请选择</option>
                                <foreach name='agency' item='value' key='key'>
                                    <option value="{$key}">{$value}</option>
                                </foreach>
                            </select>
                        </span>
                    </div>
                </div> 
            </div>
            <div class="tabCon">
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                        
                        车机型号:</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <span class="select-box" style="width:300px;">
                            <select class="select" name="supplier_no" size="1">
                                    <option value="">请选择</option>
                                    <option value="1376920002">S</option>
                                    <option value="1376920001">W</option>
                                    <option value="1376920003">S-IOT</option>
                            </select>
                        </span>
                    </div>
                </div> 
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                        
                        SIM卡商:</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <span class="select-box" style="width:300px;">
                            <select class="select" name="sim_card" size="1">
                                    <option value="">请选择</option>
                                    <option value="1376920004">阿里云</option>
                                    <option value="1376920005">赛卡</option>
                            </select>
                        </span>
                    </div>
                </div> 
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                        
                        主物联网卡号：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" id="cardcode" name="cardcode" placeholder="13位物联网卡号" value="" class="input-text">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                       
                        主物联网卡序列号：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" id="sim_id" name="sim_id" placeholder="物联网卡序列号" value="" class="input-text">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                       
                        主车载设备的编号：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" id="equipment_id" name="equipment_id" placeholder="智能设备唯一编号" value="" class="input-text">
                    </div>
                </div>
                <br>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                        
                        车机型号:</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <span class="select-box" style="width:300px;">
                            <select class="select" name="back_supplier_no" size="1">
                                   
                                 <option value="">请选择</option>
                                    <option value="1376920002">S</option>
                                    <option value="1376920001">W</option>
                                
                            </select>
                        </span>
                    </div>
                </div> 
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                        
                        副物联网卡号：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" id="website-Keywords" name="back_cardcode" placeholder="13位物联网卡号" value="" class="input-text">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                       
                        副物联网卡序列号：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" id="website-Keywords" name="back_sim_id" placeholder="物联网卡序列号" value="" class="input-text">
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">
                       
                        副车载设备的编号：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <input type="text" id="website-Keywords" name="back_equipment_id" placeholder="智能设备唯一编号" value="" class="input-text">
                    </div>
                </div>
            </div>
            <div class="tabCon">
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-3">行驶证图片</label>
                    <div class="formControls col-xs-8 col-sm-9"> <span class="btn-upload form-group">
                        <input class="input-text upload-url" type="text" id="uploadfile" readonly style="width:200px">
                        <a href="javascript:void();" class="btn btn-primary radius upload-btn"><i class="Hui-iconfont">&#xe642;</i> 浏览文件</a>
                        <input type="file" multiple name="travel_image[]" class="input-file">
                        </span> 
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-3">登记证图片</label>
                    <div class="formControls col-xs-8 col-sm-9"> <span class="btn-upload form-group">
                        <input class="input-text upload-url" type="text" id="uploadfile" readonly style="width:200px">
                        <a href="javascript:void();" class="btn btn-primary radius upload-btn"><i class="Hui-iconfont">&#xe642;</i> 浏览文件</a>
                        <input type="file" multiple name="register_image[]" class="input-file">
                        </span> 
                    </div>
                </div>
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-3">其它图片(一次可以上传多张)：</label>
                    <div class="formControls col-xs-8 col-sm-9"> <span class="btn-upload form-group">
                        <input class="input-text upload-url" type="text" id="uploadfile" readonly style="width:200px">
                        <a href="javascript:void();" class="btn btn-primary radius upload-btn"><i class="Hui-iconfont">&#xe642;</i> 浏览文件</a>
                        <input type="file" multiple name="image[]" class="input-file">
                        </span> 
                    </div>
                </div>

            </div>
            <div class="tabCon">
                <div class="row cl">
                    <label class="form-label col-xs-4 col-sm-2">汽车模型：</label>
                    <div class="formControls col-xs-8 col-sm-9">
                        <span class="select-box" style="width:300px;">
                            <select class="select" name="car_type" size="1" onchange="get_type_attr(this)">
                                <option value="">请选择</option>
                                <foreach name='type' item='value' key='key'>
                                    <option value="{$key}">{$value}</option>
                                </foreach>
                                
                            </select>
                        </span>
                    </div>
                </div>
                <div id='ajax_table_page'>
                    
                </div>
                
            </div>
        
        </div>
        <div class="row cl">
            <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-2">
                <button onClick="article_save_submit();" class="btn btn-primary radius" type="submit"><i class="Hui-iconfont">&#xe632;</i> 保存</button>
                <button onClick="layer_close();" class="btn btn-default radius" type="button">&nbsp;&nbsp;取消&nbsp;&nbsp;</button>

            </div>
        </div>
    </form>
</div>

<!--_footer 作为公共模版分离出去-->
<include file='public/_footer'>
<!--/_footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="__PUBLIC__/lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="__PUBLIC__/lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="__PUBLIC__/lib/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="__PUBLIC__/lib/jquery.validation/1.14.0/messages_zh.js"></script>
<script type="text/javascript" src="__PUBLIC__/lib/lightbox2/2.8.1/js/lightbox.min.js"></script> 
<script type="text/javascript" src="__PUBLIC__/lib/autocomplete/jquery.autocomplete.js"></script>
<script type="text/javascript">
$(function(){
    $('.skin-minimal input').iCheck({
        checkboxClass: 'icheckbox-blue',
        radioClass: 'iradio-blue',
        increaseArea: '20%'
    });
    $("#tab-system").Huitab({
        index:0
    });

    $(".portfolio-area li").Huihover();
});

// ajax获取模板属性
function get_type_attr(obj) {
    var val = obj.value;

    $.ajax({
            type: 'get',
            url: '{:url('index/cars/ajaxGetType')}',
            data:{ 'type':val },
            dataType: 'json',
            success: function(data){
                
                var strInput = '';
                for(key of data)
                {
                    
                    strInput += '<div class="row cl"><label class="form-label col-xs-4 col-sm-2">';

                    strInput += key['attr_name'];

                    strInput += '</label><div class="formControls col-xs-8 col-sm-9">';

                    if(key['attr_input_type'] == 2)
                    {
                        strInput += '<select class="select" name="car_attr['+key['attr_id']+']" size="1">';

                        for (attr of key['attr_values']){

                            strInput += '<option value="'+attr+'">'+attr+'</option>';
                            
                        }
                        strInput += '</select>';
                    }
                    else
                    {
                        strInput += '<input type="text" name="car_attr['+key['attr_id']+']" placeholder="" value="'+key['attr_values'][0]+'" class="input-text">';
                    }
                    
                    strInput += '</div></div>';
                    
                }

                
                
                $("#ajax_table_page").html(strInput);
                    
            },
            error:function(data) {
                console.log(data.msg);
            },
    }); 
}

//ajax获取共享车主信息
function get_car_type(obj) {
    var val = obj.value;
    
    var net = $(obj).parent().next();
    $.ajax({
            type: 'get',
            url: '{:url('index/cars/ajaxGetHolder')}',
            data:{ 'type':val },
            dataType: 'json',
            success: function(data){
                
                var strOption = '<select class="select" name="holder_id" size="1" id="">';
                for(key in data)
                {
                    strOption += "<option value="+key+">"+ data[key] +"</option>";                  
                }

                strOption += "</select>";
                
                net.html(strOption);
                    
            },
            error:function(data) {
                console.log(data.msg);
            },
    }); 

}

$("#form-article-add").validate({
    rules:{
        
        car_name:{
            required:true,
        },
        car_unique_id:{
            required:true,
        },
        holder_type:{
            required:true,
        },
        holder_id:{
            required:true,
        },
    }
});

// ajax获取智能设备编号
$(function(){
    var url = "{:url('index/Terminal/terminal')}";
    // var searchURL = "/cases/search.action";
    var isClicked = false;
    var defauntkeyword = "请输入关键词";
    $("#equipment_id").autocomplete(url, {
        scroll:false,
        selectFirst:false,
        delay:5,
        max:10,
        dataType:"json",//ajax的跨域，必须用jsonp,jQuery自动会加一个callback参数,后台要获得callback参数，并写回来
            //自定义提示
        tips:function(data) {
                //这里的data是跟formatItem 的data是一样的，所以格式也一样
            return data.pinyin;
        },
        parse: function(data) {
            if(data==null||typeof(data)=="undefined"||data.length==0){
                return null;
            }

            // data = data.keylist;
            console.log(data);
            var rows = [];
            for(var i=0; i<data.length; i++){
                rows[rows.length] = {
                    data:data[i],//这里data是对象数组，格式[{key:aa,address:nn},{key:aa,address:nn}]
                    value:data[i].equipment_id,
                    result:data[i].equipment_id
                };
            } console.log(rows);
            return rows;
        },
        extraParams: {query:function (){return $('#equipment_id').val();}},
        formatItem: function(data, i, total) {  //就是下拉框显示的内容，可以有格式之类的
            return "<p class=''>"+data.equipment_id+"</p>";
        },
        formatMatch: function(data, i, total) {  //要匹配的内容
            return data.equipment_id;
        },
        formatResult: function(data) {  //最终在inputText里显示的内容，就是以后要搜索的内容
            return data.equipment_id;
        }
    }).result(function(e, data) {
        if(!isClicked) {
            // startSearch();
        }
        if(data.equipment_id){
            $("#equipment_id").attr("value",data.equipment_id);
            $("#sim_id").attr("value",data.sim_id);
            $("#cardcode").attr("value",data.cardcode);
        }
    });

});

</script>
<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>
